<page-header [autoTitle]="false"></page-header>
<nz-card>
  <section class="search-section">
    <input nz-input placeholder="昵称" [(ngModel)]="keyword" class="search-item"/>
    <nz-select [(ngModel)]="role" [nzPlaceHolder]="'用户角色'" class="search-item" [nzAllowClear]="true"
               [nzShowSearch]="true">
      <nz-option
        *ngFor="let option of userRoleOption"
        [nzLabel]="option.value"
        [nzValue]="option.key">
      </nz-option>
    </nz-select>
    <button nz-button [nzType]="'primary'" nzGhost (click)="search()" class="search-item">
      <i class="anticon anticon-search"></i><span>搜索</span>
    </button>
  </section>
  <nz-table #nzTable [nzData]="page.content"
            [nzPageSize]="page.size"
            [nzTotal]="page.totalElements"
            [nzFrontPagination]="false"
            [(nzPageIndex)]="page.number"
            (nzPageIndexChange)="changePageNo($event)"
            [nzLoading]="isLoading">
    <thead>
    <tr>
      <th nz-th><span>序号</span></th>
      <th nz-th><span>昵称</span></th>
      <th nzShowSort [(nzSort)]="sortMap.totalTakCredit" (nzSortChange)="sort('totalTakCredit',$event)">
        <span>TAK总积分</span></th>
      <th nzShowSort [(nzSort)]="sortMap.residualTakCredit" (nzSortChange)="sort('residualTakCredit',$event)"><span>剩余TAK积分</span>
      </th>
      <th nzShowSort [(nzSort)]="sortMap.totalCredit" (nzSortChange)="sort('totalCredit',$event)"><span>总积分</span></th>
      <th nzShowSort [(nzSort)]="sortMap.residualCredit" (nzSortChange)="sort('residualCredit',$event)">
        <span>剩余积分</span></th>
      <th nz-th><span>用户角色</span></th>
      <th nzShowSort [(nzSort)]="sortMap.lastLoginTime" (nzSortChange)="sort('lastLoginTime',$event)">
        <span>最后登录时间</span></th>
      <th nz-th><span>操作</span></th>
    </tr>
    </thead>
    <tbody>
    <tr *ngFor="let data of nzTable.data;let i=index">
      <td>
        {{i+1}}
      </td>
      <td>{{data.name}}</td>
      <td>{{data.totalTakCredit}}</td>
      <td>{{data.residualTakCredit}}</td>
      <td>{{data.totalCredit}}</td>
      <td>{{data.residualCredit}}</td>
      <td>{{data.role|dicsNamePipe:userRoleOption}}</td>
      <td>{{data.lastLoginTime}}</td>
      <td>
        <a href="javascript:void (0);" routerLink="/otc-cus/list/detail" [queryParams]="{id: data.id}">查看详情</a>
        <nz-divider nzType="vertical"></nz-divider>
        <nz-dropdown>
          <a nz-dropdown> 更多 <i class="anticon anticon-down"></i>
          </a>
          <ul nz-menu nzSelectable>
            <li nz-menu-item>
              <a href="javascript:void (0);" style="color:#1890ff;" (click)="setCityArea(data)">关联运营中心</a>
            </li>
            <li nz-menu-item *ngIf="data.beAuth == 2">
              <nz-popconfirm [nzTitle]="'设为动态管理员，该用户将有权限直接屏蔽小程序中动态，确定吗？'" (nzOnConfirm)="setAuth(data,1)">
                <a nz-popconfirm>设为动态管理员</a>
              </nz-popconfirm>
            </li>
            <li nz-menu-item *ngIf="data.beAuth == 1">
              <nz-popconfirm [nzTitle]="'设为普通用户，将取消该用户直接屏蔽小程序中动态的权限，确定吗？'" (nzOnConfirm)="setAuth(data,2)">
                <a nz-popconfirm>设为普通用户</a>
              </nz-popconfirm>
            </li>
            <li nz-menu-item *ngIf="data.centerManager == 2">
              <nz-popconfirm [nzTitle]="'设为品牌管理员，该用户拥有小程序端设置品牌相关权限，确定吗？'" (nzOnConfirm)="setCenterManager(data,1)">
                <a nz-popconfirm>设为品牌管理员</a>
              </nz-popconfirm>
            </li>
            <li nz-menu-item *ngIf="data.centerManager == 1">
              <nz-popconfirm [nzTitle]="'取消品牌管理权限，将取消该用户小程序端设置品牌相关权限，确定吗？'" (nzOnConfirm)="setCenterManager(data,2)">
                <a nz-popconfirm>取消品牌管理权限</a>
              </nz-popconfirm>
            </li>
          </ul>
        </nz-dropdown>
      </td>
    </tr>
    </tbody>
  </nz-table>
</nz-card>
